<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">

    <title>选择地址</title>

    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/amazeui.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/app.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/index.css">

    <link href="${pageContext.request.contextPath}/assets/css/addstyle.css" rel="stylesheet" type="text/css">
    <script src="${pageContext.request.contextPath}/assets/js/jquery.min.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/assets/js/amazeui.js"></script>
    <script src="${pageContext.request.contextPath}/assets/js/vue.js"></script>
    <style type="text/css">
        hr {
            margin-top: 0px;
            margin-bottom: 0px;
        }

        a {
            color: #ed6d00;
        }

        .orange {
            color: #ed6d00 !important;
        }
    </style>
</head>

<body>

<div class="center">
    <div class="col-main">
        <div class="main-wrap">

            <div class="user-address">
                <!--标题 -->
                <div class="am-cf " style="padding:10px 5px; ">
                    <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg"
                                                     style="color:#ED6D00;">地址选择</strong>
                    </div>
                </div>
                <hr style="margin-top: 0px;margin-bottom: 0px;"/>
                <ul class="am-avg-sm-1 am-avg-md-3 am-thumbnails" id="list">

                    <li class="user-addresslist" v-for="item in items">
                        <a :href="'${pageContext.request.contextPath}/clientAddress/select?type=2&id='+item.id">
                            <p class="new-tit new-p-re" style="margin-bottom: 0px;margin-top: 5px;">
                                <span class="new-txt">{{item.contractName}}</span>
                                <span class="new-txt-rd2 orange">{{item.contractPhone}}</span>
                            </p>
                            <div class="new-mu_l2a new-p-re" style="padding-bottom: 0px;">
                                <p class="new-mu_l2cw" style="margin-bottom: 10px;">
                                    <span class="title">地址：</span>
                                    <span class="province">{{item.address}}</span></p>
                            </div>
                        </a>
                    </li>


                </ul>
                <div class="clear"></div>
                <a href="${pageContext.request.contextPath}/clientHome/goAddAddress" class="new-abtn-type"
                   style="background-color: #ed6d00;">添加地址</a>
                <!--例子-->


            </div>

            <script type="text/javascript">
                var list = new Vue({
                    el: "#list",
                    data: {
                        items: {}
                    }
                });
                $.ajax({
                    type: "get",
                    url: '${pageContext.request.contextPath}/clientAddress/getAll',
                    async: false,
                    dataType: 'json',
                    success: function (data) {

                        if (data.success == true && data.code == 200) {
                            list.items = data.obj;

                        }
                    }
                });
            </script>


        </div>


    </div>


</div>

</body>

</html>